<template>
  <!-- 小弹框 width:500,height:0.3,top:15%  -->
  <!-- 中弹框 width:800,height:0.5,top:10% -->
  <!-- 大弹框 width:1060,height:0.76,top:5% -->

  <div class="Control-1 mechanism_dialogS closure" id="comcn small">
    <el-dialog
      width="100%"
      :title="title"
      v-loading="loading"
      element-loading-text="拼命加载中"
      element-loading-background="rgba(0, 0, 0, 0.2)"
      element-loading-spinner="el-icon-loading"
      v-dialogDrag
      :visible.sync="visible"
      @close="closeDialog"
      :append-to-body="true"
      top="0%"
    >
      <div
        class="dialogBody common commonClassDialog dialogMachine"
        :style="{ height: dialogHeight }"
        style="width: 100%"
      >
        <div class="reportTab">
          <div class="tab">
            <div
              v-for="(data, index) in typeData"
              :key="data.value"
              @click="changeType($event, index)"
            >
              <div
                class="btn"
                :style="{
                  color:
                    data.show === true ? 'rgba(0, 117, 255, 1)' : '#343639',
                  background: data.show === true ? '#E0EFFF' : '#fff',
                }"
              >
                {{ data.text }}
              </div>
            </div>
          </div>
        </div>

        <div class="recordMachine" v-show="typeData[0].show">
          <div class="reportTitle" v-if="formData != null">
            <div class="reportTitleContent">
              <div class="bigTitle">{{ formData.fEngineeringname }}</div>
              <div class="samllTitle">钢筋保护层厚度试验检测记录表</div>
            </div>
            <div class="reportTitleFir">
              <div class="left">
                <div class="name">试验室名称：</div>
                <div class="lable">{{ formData.fLabname }}</div>
              </div>
              <div class="right">记录编号：{{ formData.fRecordno }}</div>
            </div>
          </div>

          <div class="reportContent">
            <div class="regular">
              <div
                class="reportTr"
                :style="{ width: item.row }"
                v-for="item in recordTableObj"
                :key="item.lable"
              >
                <div
                  class="reportTrLable"
                  :style="{
                    flex: item.type == 2 ? '20%' : item.type == 3 ? '30%' : '',
                  }"
                >
                  {{ item.lable }}
                </div>

                <div
                  class="reportTrValue"
                  v-if="formData != null"
                  :style="{ flex: item.type == 2 ? '20%' : '' }"
                >
                  <div v-if="item.type == 1" class="sampleInfo">
                    取样日期：<el-date-picker
                      style="width: 140px"
                      v-model="formData.fSampledates"
                      type="date"
                      :disabled="sgDisabled"
                      placeholder="选择日期"
                      format="yyyy 年 MM 月 dd 日"
                      value-format="yyyy-MM-dd"
                      @change="changeData($event, 'fSampledates')"
                    >
                    </el-date-picker>
                    ;样品编号{{ formData.fSampleno }}
                  </div>
                  <div v-else>{{ item.key }}</div>
                </div>
              </div>
            </div>
            <div class="titleBox">保护层厚度</div>

            <div class="regular">
              <div
                class="reportTr"
                :style="{ width: item.row }"
                v-for="item in associatedObj"
                :key="item.lable"
              >
                <div
                  class="reportTrLable"
                  :style="{
                    flex: item.with == 2 ? '20%' : item.with == 3 ? '30%' : '',
                  }"
                >
                  {{ item.lable }}
                </div>

                <div
                  class="reportTrValue"
                  :style="{ flex: item.with == 2 ? '20%' : '' }"
                >
                  <el-input
                    type="number"
                    v-if="item.type == 1"
                    :placeholder="item.placeholder"
                    v-model="item.key"
                    :disabled="sgDisabled"
                    @input="inputFun($event, '0', '0', item.value)"
                  />
                  <div v-else>{{ item.key }}</div>
                </div>
              </div>
            </div>
            <div class="regular">
              <div
                class="reportTr"
                :style="{ width: item.row }"
                v-for="item in measurePointObj"
                :key="item.lable"
              >
                <div
                  class="reportTrLable"
                  :style="{
                    flex: item.with == 2 ? '20%' : item.with == 3 ? '30%' : '',
                  }"
                >
                  {{ item.lable }}
                </div>

                <div
                  class="reportTrValue"
                  :style="{ flex: item.with == 2 ? '20%' : '' }"
                >
                  <el-input
                    type="number"
                    v-if="item.type == 1"
                    :placeholder="item.placeholder"
                    v-model="item.key"
                    :disabled="sgDisabled"
                    @input="inputFun($event, '0', '0', item.value)"
                  />
                  <div v-else>{{ item.key }}</div>
                </div>
              </div>
            </div>

            <div class="formList">
              <div
                class="formListBox"
                v-for="(item, index) in formList"
                :key="index"
              >
                <div class="formListBoxNum">{{ index + 1 }}</div>
                <div class="formListS">
                  
                  <div class="formListBoxTitle">
                    <div>单值</div>
                    <div>修正后单值</div>
                    <div style="border-bottom: none">保护层厚度</div>
                  </div>

                  <div class="formListBoxRow">
                    <div
                      class="formListBoxRow_box"
                      v-for="(v, i) in item"
                      :key="i"
                    >

                      <div class="SingleValued">
                        <el-input
                          type="number"
                          v-model="v.fCheckvalue1"
                          :disabled="sgDisabled"
                          :ref="index + 'fParam' + i + 'gb' + '1'"
                          placeholder="/"
                          @keyup.native="moveFocus($event, index, i, '1')"
                          @input="inputFun($event, index, i, '1')"
                        />
                      </div>

                      <div class="SingleValued SingleValued1">
                        <el-input
                          type="number"
                          :ref="index + 'fParam' + i + 'gb' + '2'"
                          v-model="v.fCheckvalue2"
                          :disabled="sgDisabled"
                          placeholder="/"
                          @keyup.native="moveFocus($event, index, i, '2')"
                          @input="inputFun($event, index, i, '2')"
                        />
                      </div>

                      <div class="SingleValued">
                        {{ v.fAmendvalue1 }}
                      </div>
                      <div class="SingleValued SingleValued1">
                        {{ v.fAmendvalue2 }}
                      </div>

                      <div class="protect">
                        {{ v.fProtectionthickness }}
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <div class="regular">
              <div
                class="reportTr"
                :style="{ width: item.row }"
                v-for="item in recordTableBottomObj"
                :key="item.lable"
              >
                <div
                  class="reportTrLable"
                  :style="{
                    flex: item.type == 4 ? '21%' : '',
                  }"
                >
                  {{ item.lable }}
                </div>
                <div
                  class="reportTrValue"
                  :style="{ flex: item.type == 2 ? '20%' : '' }"
                >
                  <div>{{ item.key }}</div>
                </div>
              </div>
            </div>

            <div class="note">
              <div class="left">
                <div class="name">附加说明：</div>
                <div class="lable">
                  <el-input
                    type="textarea"
                    rows="2"
                    resize="none"
                    v-model="formData.fAdditionaldescription"
                    :disabled="sgDisabled"
                    placeholder="请填写"
                  />
                </div>
              </div>
              <div class="right">
                <div class="name">
                  <div class="jlnoteName">监理意见：</div>
                  <div class="jlnoteLable">
                    {{ formData.fJlopinion }}
                    <!-- <el-input
                      type="textarea"
                      rows="1"
                      resize="none"
                      v-model="formData.fJlopinion"
                      :disabled="jlDisabled"
                      placeholder="请监理填写"
                    ></el-input> -->
                  </div>
                </div>
                <div class="lable">
                  <div class="placeholder"></div>
                  <div class="jlengineer">
                    监理工程师：{{ formData.fJlengineername }}
                  </div>
                  <div class="jltime">
                    日期：
                    <!-- {{ formData.fJlcheckdates }} -->
                    <el-date-picker
                      v-model="formData.fJlcheckdates"
                      type="date"
                      :clearable="false"
                      format="yyyy 年 MM 月 dd 日"
                      value-format="yyyy-MM-dd"
                      :disabled="jlDisabled"
                      @change="changeData($event, 'fJlcheckdates')"
                    >
                    </el-date-picker>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div class="sgSign" v-if="formData != null">
            <div>检测：{{ formData.fCheckername }}</div>
            <div>记录：{{ formData.fRecordername }}</div>
            <div>复核：{{ formData.fRecheckername }}</div>
            <!-- <div class="select">
              <div class="name">记录：</div>
              <el-select
                v-model="formData.fRecordername"
                @change="selectChange($event, 0)"
                placeholder="/"
                :disabled="perDisabled"
              >
                <el-option
                  :label="item.label"
                  :value="item"
                  v-for="(item, index) in personList"
                  :key="index"
                ></el-option>
              </el-select>
            </div>
            <div class="select">
              <div class="name">复核：</div>
              <el-select
                v-model="formData.fRecheckername"
                @change="selectChange($event, 1)"
                placeholder="/"
                :disabled="perDisabled"
              >
                <el-option
                  :label="item.label"
                  :value="item"
                  v-for="(item, index) in personList"
                  :key="index"
                ></el-option>
              </el-select>
            </div> -->
            <div class="time">
              日期：
              <div class="timeInput">
                <el-date-picker
                  v-model="formData.fRecheckdates"
                  type="date"
                  :clearable="false"
                  placeholder="选择日期"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd"
                  :disabled="sgDisabled"
                  @change="changeData($event, 'fRecheckdates')"
                >
                </el-date-picker>
              </div>
            </div>
          </div>
        </div>

        <div class="recordMachine" v-show="typeData[1].show">
          <div class="reportTitle" v-if="formData != null">
            <div class="reportTitleContent">
              <div class="bigTitle">{{ formData.fEngineeringname }}</div>
              <div class="samllTitle">钢筋保护层厚度试验检测报告</div>
            </div>
            <div class="reportTitleFir">
              <div class="left">
                <div class="name">试验室名称：</div>
                <div class="lable">{{ formData.fLabname }}</div>
              </div>
              <div class="right">记录编号：{{ formData.fRecordno }}</div>
            </div>
          </div>

          <div class="reportContent">
            <div class="regular">
              <div
                class="reportTr"
                :style="{ width: item.row }"
                v-for="item in testReportObj"
                :key="item.lable"
              >
                <div
                  class="reportTrLable"
                  :style="{
                    flex: item.type == 2 ? '20%' : item.type == 3 ? '30%' : '',
                  }"
                >
                  {{ item.lable }}
                </div>

                <div
                  class="reportTrValue"
                  :style="{ flex: item.type == 2 ? '20%' : '' }"
                >
                  <el-input
                    type="text"
                    v-if="item.type == 1"
                    :placeholder="item.placeholder"
                    v-model="item.key"
                    :disabled="sgDisabled"
                  />
                  <div v-else>{{ item.key }}</div>
                </div>
              </div>
            </div>
            <div class="titleBox">保护层厚度</div>

            <div class="regular">
              <div
                class="reportTr"
                :style="{ width: item.row }"
                v-for="item in associatedObj"
                :key="item.lable"
              >
                <div
                  class="reportTrLable"
                  :style="{
                    flex: item.with == 2 ? '20%' : item.with == 3 ? '30%' : '',
                  }"
                >
                  {{ item.lable }}
                </div>

                <div
                  class="reportTrValue"
                  :style="{ flex: item.with == 2 ? '20%' : '' }"
                >
                  <el-input
                    type="number"
                    v-if="item.type == 1"
                    :placeholder="item.placeholder"
                    v-model="item.key"
                    :disabled="sgDisabled"
                    @input="inputFun($event, '0', '0', item.value)"
                  />
                  <div v-else>{{ item.key }}</div>
                </div>
              </div>
            </div>

            <div class="formList">
              <div
                class="formListBox"
                v-for="(item, index) in formList"
                :key="index"
              >
                <div class="formListBoxNum_Report">
                  {{ index }}
                </div>
                <div class="formListS">
                  <div class="formListBoxRow_Report">
                    <div
                      class="formListBoxRow_box_Report"
                      v-for="(v, i) in item"
                      :key="i"
                    >
                      {{ v.fProtectionthickness }}
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="regular">
              <div
                class="reportTr"
                :style="{ width: item.row }"
                v-for="item in recordTableBottomObj"
                :key="item.lable"
              >
                <div
                  class="reportTrLable"
                  :style="{
                    flex: item.type == 4 ? '21%' : '',
                  }"
                >
                  {{ item.lable }}
                </div>
                <div
                  class="reportTrValue"
                  :style="{ flex: item.type == 2 ? '20%' : '' }"
                >
                  <div>{{ item.key }}</div>
                </div>
              </div>
            </div>
            <div class="regular">
              <div
                class="reportTr"
                :style="{ width: item.row }"
                v-for="item in MaxAndMinObj"
                :key="item.lable"
              >
                <div
                  class="reportTrLable"
                  :style="{
                    flex: item.type == 4 ? '21%' : '',
                  }"
                >
                  {{ item.lable }}
                </div>
                <div
                  class="reportTrValue"
                  :style="{ flex: item.type == 2 ? '20%' : '' }"
                >
                  <div>{{ item.key }}</div>
                </div>
              </div>
            </div>

            <div class="conclusion">
              检测结论：经检测，该构件钢筋保护层厚度合格率为{{
                recordTableBottomObj[2].key
              }}%
            </div>

            <div class="note">
              <div class="left">
                <div class="name">附加说明：</div>
                <div class="lable">
                  <el-input
                    type="textarea"
                    rows="2"
                    resize="none"
                    v-model="formData.fAdditionaldescription"
                    :disabled="sgDisabled"
                    placeholder="请填写"
                  />
                </div>
              </div>
              <div class="right">
                <div class="name">
                  <div class="jlnoteName">监理意见：</div>
                  <div class="jlnoteLable">
                    {{ formData.fJlopinion }}
                    <!-- <el-input
                      type="textarea"
                      rows="1"
                      resize="none"
                      v-model="formData.fJlopinion"
                      :disabled="jlDisabled"
                      placeholder="请监理填写"
                    ></el-input> -->
                  </div>
                </div>
                <div class="lable">
                  <div class="placeholder"></div>
                  <div class="jlengineer">
                    监理工程师：{{ formData.fJlengineername }}
                  </div>
                  <div class="jltime">
                    日期：
                    <el-date-picker
                      v-model="formData.fJlcheckdates"
                      type="date"
                      :clearable="false"
                      format="yyyy 年 MM 月 dd 日"
                      value-format="yyyy-MM-dd"
                      :disabled="jlDisabled"
                      @change="changeData($event, 'fJlcheckdates')"
                    >
                    </el-date-picker>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div class="sgSign" v-if="formData != null">
            <div>检测：{{ formData.fCheckername }}</div>
            <div>审核：{{ formData.fAduitname }}</div>
            <div>批准：{{ formData.fRatifyname }}</div>
            <div class="time">
              日期：
              <div class="timeInput">
                <el-date-picker
                  v-model="formData.fRecheckdates"
                  type="date"
                  :clearable="false"
                  placeholder="选择日期"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd"
                  :disabled="sgDisabled"
                  @change="changeData($event, 'fRecheckdates')"
                >
                </el-date-picker>
              </div>
            </div>
          </div>
        </div>

        <div
          class="recordMachine"
          style="height: 90%"
          v-show="typeData[2].show"
        >
          <div class="tableInfo">
            <tableData
              height="100%"
              width="100%"
              :config="table_config"
              :currentRow="false"
              :dataList="tableData"
              :loading="loading"
              placeholderText=""
              @inputValue="inputValue"
              statusType="1"
            />
          </div>
        </div>

        <div
          class="newlyAdded_btn"
          style="top: 38px; bottom: 0px"
          v-if="buttonShow"
        >
          <el-button
            :disabled="isLock"
            v-show="statusNum == 1"
            type="primary"
            @click="yj_saveForm(statusNum,0)"
          >
            <!-- 编辑保存 -->
            保存
          </el-button>
          <el-button
            :disabled="isLock"
            v-show="statusNum == 3"
            type="primary"
            @click="yj_saveForm(statusNum,0)"
          >
            审核保存
          </el-button>

          <el-button type="warning" @click="visible = false">关闭</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script src="./index.js"></script>
<style lang="less" scoped>
@import "./index.less";
</style>
